<template>
  <!--个人资料页面-->
  <div class="personziliao">
    <wv-group>
      <wv-cell>
        <img src="../../../assets/userhead.png" slot="icon" class="cell-icon touxiang" width="50" v-if="accountInfo.userhead==''">
        <img :src="accountInfo.userhead | imgPathFilter" slot="icon" class="cell-icon touxiang" width="53" height="53" v-else>
        <span slot="ft" @click="showUploadImg()">修改 <img src="../../../assets/right.png" alt="" width="6"></span>
      </wv-cell>
      <wv-cell title="登录账号" :value="account.accountName"></wv-cell>
      <wv-cell title="绑定手机号">
        <span slot="ft">{{account.mobile}}<span class="change" @click="changePhone()">更换</span></span>
      </wv-cell>
      <wv-cell title="应急手机号">
        <span slot="ft">{{accountInfo.telephone}}<span class="change" @click="changeEmergencyPhone()">更换</span></span>
      </wv-cell>
      <div v-if="accountInfo.isPrivatedata==1">
        <wv-cell title="姓名" :value="privatedata.userName"></wv-cell>
        <wv-cell title="证件类型" v-if="privatedata.identityType==1" value="身份证"></wv-cell>
        <wv-cell title="证件类型" v-if="privatedata.identityType==2" value="护照"></wv-cell>
        <wv-cell title="证件类型" v-if="privatedata.identityType==3" value="港澳通行证"></wv-cell>
        <wv-cell title="证件类型" v-if="privatedata.identityType==4" value="台胞证"></wv-cell>
        <wv-cell title="身份证号" :value="privatedata.identityNo"></wv-cell>
        <wv-cell title="性别" v-if="privatedata.sex==1" value="女"></wv-cell>
        <wv-cell title="性别" v-if="privatedata.sex==2" value="男"></wv-cell>
      </div>
    </wv-group>
  </div>
</template>

<script type="text/ecmascript-6">
  import {wxApi} from '../../../../test/unit/flyme_weixin'
  import {getUserInfoDetail, updateUserhead} from '../../../../test/unit/http'
  import {Toast} from 'we-vue'
  export default {
    name: 'ziliao',
    props: {},
    data() {
      return {
        type: 'ios',
        privatedata: {},
        accountInfo: {},
        account: {},
      };
    },
    methods: {
      showUploadImg(){
        let that = this;
        wxApi.chooseImage({
          count: 1,
          callback: function (res, localIds) {
            let imgId = res.serverId;
            let params = {
              'headImgId': imgId
            };
            updateUserhead(params).then(res => {
              if (res.code == 100) {
                that.getUserInfo();
              } else {
                Toast.fail('上传失败');
              }
            })
          }
        });
      },
      changePhone(){
        let account = this.account;
        let result = this.$myUtils.isNull(account.mobile);
        if (result) {
          //   第一次绑定
          this.$router.push({path: '/changePhone'})
        } else {
          //    非第一次绑定
          this.$router.push({path: '/huanbangphone', query: {mobile: account.mobile}})
        }
      },
      getUserInfo(){
        let that = this;
        getUserInfoDetail({}).then(res => {
          console.log(res);
          if (res.code = 100) {
            that.privatedata = res.object.privatedata;
            that.accountInfo = res.object.accountInfo;
            if(this.$myUtils.isNull(that.accountInfo.userhead)){
              that.accountInfo['userhead']='';
            }
            that.account = res.object.account;
          } else {
            Toast.fail(res.info);
          }
        })
      },
      changeEmergencyPhone(){
        this.$router.push({path: 'changeemergency'})
      }
    },
    mounted () {
    },
    created() {
      wxApi.init();
      this.getUserInfo();
    },
    components: {}

  }
</script>


<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped lang="less" rel="stylesheet/less">
  .change {
    color: #2f95f0;
    margin-left: 5px;
  }

  .touxiang {
    border-radius: 50%;
  }

</style>
